<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
    <script>
        function submitForm(){
            let input = document.getElementById("img")
            const avatar = input.files[0]
            const formData = new FormData()
            formData.append("avatar",avatar)
            const config = { headers:{'Content-Type':'multipart/form-data'}}
            axios.post('/',formData,config).then(
                res => {
                    document.getElementById("res").innerHTML = res.data.data
                }
            )
        }
    </script>
    <div>
        <div id="res"></div>
        <form  method="POST" enctype="multipart/form-data" >
            <table>
                <tr><td>File to upload:</td><td><input id="img" type="file" name="file" /></td></tr>
                <tr><td></td><td><input type="button" value="Upload" onClick="submitForm()" /></td></tr>
            </table>
        </form>
    </div>
</body>
</html>